{% extends 'base.html' %}
{% block legend %} Dubbo接口调试工具{% endblock %}
{% block content %}
    <blockquote class="layui-elem-quote">通过ip和端口，调试本地dubbo服务</blockquote>

    <div class="layui-row">
        <div class="layui-col-md6">
            <form class="layui-form layui-form-pane" method="POST">
                <div class="layui-form-item">
                    <label class="layui-form-label">地址</label>
                    <div class="layui-input-block">
                        <label>
                            <input type="text" id="host" placeholder="请输入地址信息" class="layui-input"
                                   lay-verify="required">
                        </label>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">端口</label>
                    <div class="layui-input-block">
                        <label>
                            <input type="text" id="port" placeholder="请输入端口信息" class="layui-input"
                                   lay-verify="required|number">
                        </label>
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">服务</label>
                    <div class="layui-input-block">
                        <label>
                            <input type="text" id="service" placeholder="请输入服务信息" class="layui-input"
                                   lay-verify="required">
                        </label>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">接口</label>
                    <div class="layui-input-block">
                        <label>
                            <input type="text" id="method" placeholder="请输入接口信息" class="layui-input"
                                   lay-verify="required">
                        </label>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">参数</label>
                    <div class="layui-input-block">
                        <label>
                            <textarea type="text" id="args" placeholder="请输入请求参数"
                                      class="layui-textarea layui-font-red"></textarea>
                        </label>
                    </div>
                </div>

                <div class="layui-form-item">
                    <button lay-filter="dubboLocal" class="layui-btn" lay-submit="">提交</button>
                </div>

            </form>
        </div>

        <script>
            layui.use('form', function () {
                let form = layui.form;
                form.on('submit(dubboLocal)', function () {
                    let $ = layui.$;
                    $.ajax({
                        method: 'post',
                        url: '/dubbo/request',
                        data: {
                            host: $('#host').val(),
                            port: $('#port').val(),
                            service: $('#service').val(),
                            method: $('#method').val(),
                            args: $('#args').val()
                        },
                        success: function (res) {
                            layer.open({
                                area: ['50%', '90%'],
                                content: `<pre class="layui-code">${res.obj}</pre>`,
                                title: res.msg
                            });
                            layui.use('code', function () {
                                layui.code({
                                    elem: 'pre',
                                    encode: true,
                                    skin: 'notepad'
                                });
                            });
                        },
                        error: function () {
                            layer.open({
                                icon: 5,
                                content: '接口请求失败，请检查。',
                                title: 'dubbo接口'
                            })
                        }
                    })
                    return false;
                })
            });
        </script>
    </div>


{% endblock %}